import React, {Component} from 'react'
import {connect} from 'react-redux'
import {actionCreators} from './store'
import {Redirect} from 'react-router-dom'
import {
    LoginWrapper,
    Logins,
    Input,
    Button
} from './style'


class Login extends Component {
    render() {
        const {handelClickLogin, login} = this.props
        return (
            <div>
                {login ? <Redirect to='/'/> : null}
                <LoginWrapper>
                    <Logins>
                        <Input placeholder="账号"/>
                        <Input placeholder="密码"/>
                        <Button onClick={handelClickLogin}>登录</Button>
                    </Logins>
                </LoginWrapper>
            </div>

        )
    }
}

const mapState = (state) => {
    return {
        login: state.getIn(['login', 'loginFlag'])
    }
}

const mapActionToProps = (dispatch) => {
    return {
        handelClickLogin() {
            dispatch(actionCreators.goLogin())
        }
    }
}

export default connect(mapState, mapActionToProps)(Login)